.navbar {
    height: 100px;
    filter: brightness(99%);
}

.navbar-dark {
    background: url('images/100pxHeaderPurple.jpg');
}

.navbar {
    .navbar-text {
        color: white;
    }

    .navbar-brand {
        display: flex;
        align-items: center;
        font-size: 1.5rem;
        color: white;
    }

    .nav-title {
        font-family: Montserrat, "Open Sans", Helvetica, Arial, sans-serif;
        font-weight: 700;
    }

    .nav-logo {
        display: inline-block;
        height: 100%;
        margin-right: 1rem;
        font-size: 0px;
    }

    .acc-logo {
        display: inline-block;
        background-size: contain;
        background-repeat: no-repeat;
        background-position-y: center;
        background-position-x: left;
        background-image: url('images/ACC_starACC_logo-white_2.png');
        width: 150px;
        height: 80px;
    }

    .navbar-nav {
        justify-content: flex-end;
        height: 100%;
        display: flex;
        align-items: center;
    }

    .nav-item {
        height: 100%;
        display: flex;
        align-items: center;
        font-family: Montserrat, "Open Sans", Helvetica, Arial, sans-serif;
    }

    .dropdown-menu {
        padding: 0px;
        right: 0px;
        left: auto !important;
    }

    .navbar-collapse {
        height: 100%;
    }

    .dropdown-item {
        color: #4d1979;
        padding-top: 0.5rem;
        padding-bottom: 0.5rem;
        border-radius: 4px;

        span {
            padding-right: 0.5rem;
        }
    }

    .dropdown-item:hover span {
        padding-left: 0.5rem;
        padding-right: 0rem;
    }

    .dropdown-item:hover span, .dropdown-item:hover {
        background-color: #4d1979;
        color: white !important;
    }

    .dropdown-item span, .dropdown-item {
        text-decoration: none !important;
        transition: padding 0.1s ease-in-out;
    }

    .static-item {
        color: #4d1979;
        border-radius: 4px;
        padding: var(--bs-dropdown-item-padding-y) var(--bs-dropdown-item-padding-x);
        white-space: nowrap;
        font-style: italic;
        display: inline-block;
    }

    .nav-link-underline {
        height: 3px;
        background-color: #c1d82f;
        transition: width 0.2s ease-in-out;
    }

    .nav-link:not(.active) .nav-link-underline {
        width: 0px;
    }

    .nav-link-content {
        display: inline-block;
    }

    .nav-item:hover .nav-link-underline, .nav-link.active .nav-link-underline {
        width: 100%;
    }

    .navbar-toggler, .navbar-toggler:focus {
        border-width: 3px;
        box-shadow: none;
    }

    .collapsing {
        transition: none !important;
    }

    @media screen and (max-width: 991px) {
        .navbar-collapse {
            position: absolute;
            width: 96%;
            top: 100px;
            left: 2%;
            background: #4d1979;
            border-radius: 0px 0px 8px 8px;
            height: auto !important;
        }

        .nav-link-underline {
            height: 0px !important;
            width: 0px !important;
        }

        .nav-link {
            box-shadow: none !important;
            text-align: center;
            padding-top: 18px;
            padding-bottom: 18px;
        }

        .nav-item:not(:first-child) {
            border-top: 1px #260859 solid;
        }

        .nav-item:not(:last-child) {
            border-bottom: 1px #260859 solid;
        }

        .nav-item {
            width: 100%;
            display: block;
        }

        .dropdown-menu {
            width: 100%;
            border-radius: 0px;
            margin-top: 0px !important;
        }

        .dropdown-item, .static-item {
            text-align: center;
            background-color: #260859;
            color: white;
            border-radius: 0px;
            width: 100%;
            padding-top: 18px;
            padding-bottom: 18px;
        }

        .dropdown-item:hover, .dropdown-item:hover span {
            background-color: #260859;
        }

        .dropdown-menu li:not(:first-child) {
            border-top: 1px #4d1979 solid;
        }

        .dropdown-item span, .dropdown-item:hover span {
            padding-left: 0.5rem !important;
            padding-right: 0.5rem !important;
        }

        .nav-logo {
            display: block;
        }

        .navbar-brand {
            display: block;
        }

        .nav-title {
            font-size: 1.2rem !important;
        }

        .acc-logo {
            width: 150px;
            height: 50px;
        }
    }
}
